<template>
  <div class="item">
    <div :class="['hei',shuai]" v-if="item===1||hei"></div>
  </div>
</template>

<script>
export default {
  props: ["x", "y", "item", "current"],
  computed: {
    hei() {
      return this.current.some(item => {
        return item[0] === this.x && item[1] === this.y;
      });
    },
    shuai() {
      let abc;
      this.current.some((item, index) => {
        if (item[0] === this.x && item[1] === this.y) {
          abc = "a";
        }
        return item[0] === this.x && item[1] === this.y;
      });
      return abc;
    }
  }
};
</script>

<style>
.item {
  width: 30px;
  height: 30px;
  border: 1px solid rgb(212, 212, 212);
}
.hei {
  height: 30px;
  width: 30px;
  background: rgb(92, 92, 92);
  border: 1px solid #ccc;
}
.a {
  background: rgb(255, 0, 0);
}
.b {
  background: rgb(255, 238, 0);
}
.c {
  background: rgb(55, 0, 255);
}
.d {
  background: rgb(0, 0, 0);
}
</style>
